<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>快快车管家</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <meta name="renderer" content="webkit" />
    <link rel="icon" type="image/png" href="../assets/i/favicon.png" />
    <link rel="stylesheet" href="../assets/css/amazeui.min.css" />
    <link rel="stylesheet" href="../assets/css/app2.css" />
    <link rel="stylesheet" href="../assets/css/icon2.css"/>
    <style type="text/css">
        p{margin: 0;}
        ul, li{padding: 0;margin: 0;list-style: none}
        .products-list ul li{color: #808080;font-size: 14px;padding: 0 15px}
        .numLi p span{width: 100%;display: block;height: 25px;color: #000000;font-weight: bold;}
        .numLi p span b, .red{color: #e81616 !important;}
        [class*=am-u-]{padding: 0;}
        span.am-fr{color: #333333}
        p.txt b, .green{font-weight: normal;color: #029d3a !important}
        .tips{display: block;text-align: center;color: #bebebe;padding: 5px 0;}
        hr{margin: 0;}
        .ti{color: #000000}
        .rule{display:block;width: 70px;height:30px;line-height:30px;margin-top:10px;margin-right:10px;padding:0 5px;background-color: #FFFFFF;border: 1px solid #dedfe0;color: #a6a6a6;border-radius: 5px;}
    </style>
</head>
<body>
<div class="products-list" style="border-top:1px solid #d2d2d2;margin-top: 10px;">
    <ul>
        <li class="add">
            <span class="am-fl ti">订单详情</span>
            <span class="am-fr">
                <b class="green" style="margin-right: 5px;">服务完成</b>
                <i class="ui-fonts icon-chevron-right am-fr right ">&#xe601;</i>
            </span>
        </li>
    </ul>
</div>

<div class="products-list" style="border-top:1px solid #d2d2d2;margin-top: 10px;">
    <ul>
        <li class="add">
            <span class="am-fl ti">交车时间</span>
            <span class="am-fr">2015-6-26&nbsp;&nbsp;18：15</span>
        </li>
        <li class="change">
            <span class="am-fl ti">初始里程</span>
            <span class="am-fr">32567km</span>
        </li>
        <li class="change">
            <span class="am-fl ti">项目费用</span>
            <span class="am-fr"><b style="color: #808080; font-weight: normal;">(行驶4.3km)</b>32571km</span>
        </li>
    </ul>
</div>

<div class="products-list" style="border-top:1px solid #d2d2d2;margin-top: 10px;">
    <ul>
        <li class="add">
            <span class="am-fl ti">路程共计</span>
            <span class="am-fr green">5公里</span>
            <span class="am-fr"><button class="rule">计费规则</button></span>
        </li>
        <li class="change">
            <span class="am-fl ti">服务费用</span>
            <span class="am-fr green">20元</span>
        </li>
        <li class="change">
            <span class="am-fl ti">项目费用</span>
            <span class="am-fr green"><b style="color: #808080; font-weight: normal;">(普通洗车)</b>48元</span>
        </li>
    </ul>
</div>

<div class="tips am-text-sm">当前在有效范围内，可以用优惠券<span class="green">10</span>元</div>

<div class="products-list" style="border-top:1px solid #d2d2d2;margin-bottom: 10px;">
    <ul>
        <li class="add">
            <span class="am-fl ti">合&nbsp;&nbsp;计：</span>
            <span class="am-fr green">48元</span>
        </li>
        <li class="change">
            <span class="am-fr red">未支付</span>
        </li>
    </ul>
</div>

<section class="kuaikuai-btn2" style="height: 65px;">
    <button type="submit" class="btn am-btn am-btn-danger am-btn-lg am-btn-buy">在线支付36元（-2元）</button>
</section>

<script src="../assets/js/jquery.min.js" type="text/javascript"></script>
<script src="../assets/js/amazeui.js" type="text/javascript"></script>
</body>
</html>